<template>
    <div>
        <el-button type="primary" link @click="openDialog">隐私服务说明</el-button>
        <el-dialog v-model="show" width="800px" title="隐私服务说明" append-to-body align-center center draggable
            destroy-on-close>
            <div v-html="html" class="markdown-body"></div>
            <div solt="footer" style="text-align: right;padding-top: 20px;">
                <el-button @click="closeDialog">关闭</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script setup>
import 'github-markdown-css'
import { markdown, html } from "@/assets/privacy.md"

// 控制弹窗显示
const show = ref(false)


// 打开弹窗并加载 Markdown 文件
const openDialog = () => {
    show.value = true
}

// 关闭弹窗
const closeDialog = () => {
    show.value = false
}

</script>

<style scoped>
/* 自定义样式 */
.markdown-body {
    overflow-y: auto;
    max-height: 60vh;
}
</style>
